﻿@namespace MudBlazor.Docs.Examples

<MudButton Variant="Variant.Text" OnClick="@(() => OpenDrawer(Anchor.Start))">Start</MudButton>
<MudButton Variant="Variant.Text" OnClick="@(() => OpenDrawer(Anchor.End))">End</MudButton>
<MudButton Variant="Variant.Text" OnClick="@(() => OpenDrawer(Anchor.Top))">Top</MudButton>
<MudButton Variant="Variant.Text" OnClick="@(() => OpenDrawer(Anchor.Bottom))">Bottom</MudButton>

<MudDrawer @bind-Open="@_open" Width="@_width" Height="@_height" Anchor="@_anchor" Elevation="1" Variant="@DrawerVariant.Temporary">
    <MudDrawerHeader>
        <MudText Typo="Typo.h6">My App</MudText>
    </MudDrawerHeader>
    <MudNavMenu>
        <MudNavLink Match="NavLinkMatch.All">Store</MudNavLink>
        <MudNavLink Match="NavLinkMatch.All">Library</MudNavLink>
        <MudNavLink Match="NavLinkMatch.All">Community</MudNavLink>
    </MudNavMenu>
</MudDrawer>

@code{ 
    private bool _open;
    private Anchor _anchor;
    private string _width, _height;

    private void OpenDrawer(Anchor anchor)
    {
        _open = true;
        _anchor = anchor;

        switch (anchor)
        {
            case Anchor.Start:
                _width = "300px";
                _height = "100%";
                break;
            case Anchor.End:
                _width = "400px";
                _height = "100%";
                break;
            case Anchor.Bottom:
                _width = "100%";
                _height = "200px";
                break;
            case Anchor.Top:
                _width = "100%";
                _height = "350px";
                break;
        }
    }
}
